<template>
  <view class="feedback-form">
    <text class="form-title">意见反馈</text>

    <!-- 意见标题 -->
    <view class="form-field">
      <text class="form-label">意见标题：</text>
      <input class="form-input" v-model="title" placeholder="请输入标题" />
    </view>
	<!-- 用户id -->
	<view class="form-field">
	  <text class="form-label">用户id：</text>
	  <input class="form-input" v-model="uid" placeholder="请输入id" />
	</view>

    <!-- 意见内容 -->
    <view class="form-field">
      <text class="form-label">意见内容：</text>
      <textarea class="form-textarea" v-model="content" placeholder="请输入意见内容"></textarea>
    </view>

    <!-- 提交按钮 -->
    <button class="submit-button" @click="submitFeedback">提交意见</button>
  </view>
</template>

<script>
export default {
  data() {
    return {
		uid: '', 
      title: '',  // 用户输入的意见标题
      content: '' // 用户输入的意见内容
    };
  },
  
  

  methods: {
    submitFeedback() {
      // 检查是否填写完整
      if (!this.title || !this.content) {
        uni.showToast({
          title: '请填写完整的意见信息',
          icon: 'none'
        });
        return;
      }

      // 提交反馈意见
      uni.request({
        url: 'http://localhost:9205/opinion', // 替换为你的实际接口地址
        method: 'POST',
		header: {
			'authorization': 'eyJhbGciOiJIUzUxMiJ9.eyJ1c2VyX2lkIjoxLCJ1c2VyX2tleSI6ImI0OWU4NmFkLTZhNTMtNGQyNS1iNzFkLTQ1NjBiOTE2ZTFhNSIsInVzZXJuYW1lIjoiYWRtaW4ifQ.PHw5Ez00yg0Vk_Wx4zO3rnSUHe2znWiWOK2IhwFS80dqK02znBtDbe7GfAiuT3YOQSsnBdIi0O7fjprpExMxlg'
		},
        data: {
			uid:1,
          title: this.title,
          content: this.content
        },
        success: (res) => {
          if (res.statusCode === 200) {
            // 成功后弹出模态框提示反馈成功
            uni.showModal({
              title: '提交成功',
              content: '感谢您的反馈，我们会尽快处理！',
              showCancel: false,  // 不显示取消按钮
              success: () => {
                // 成功后跳转回上一页
                uni.navigateBack();
              }
            });
          } else {
            uni.showToast({
              title: '提交失败，请重试',
              icon: 'none'
            });
          }
        },
        fail: () => {
          uni.showToast({
            title: '提交失败，请检查网络',
            icon: 'none'
          });
        }
      });
    }
  }
};
</script>

<style scoped>
.feedback-form {
  padding: 20px;
  background-color: #f9f9f9;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  max-width: 500px;
  margin: 20px auto;
}

.form-title {
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 20px;
  color: #333;
}

.form-field {
  margin-bottom: 20px;
}

.form-label {
  font-size: 16px;
  color: #555;
  margin-bottom: 8px;
  display: block;
}

.form-input, .form-textarea {
  width: 100%;
  padding: 10px;
  font-size: 16px;
  border: 1px solid #ddd;
  border-radius: 4px;
  background-color: #fff;
  box-sizing: border-box;
}

.form-input {
  height: 40px;
}

.form-textarea {
  min-height: 100px;
  resize: none;
}

.submit-button {
  padding: 12px;
  background-color: #007bff;
  color: white;
  border: none;
  border-radius: 4px;
  font-size: 16px;
  cursor: pointer;
  width: 100%;
  text-align: center;
  transition: background-color 0.3s;
}

.submit-button:hover {
  background-color: #0056b3;
}
</style>
